<template>
  <el-upload :http-request="uploadAlyiVideo"
             :on-success="handleVodUploadSuccess"
             :on-remove="handleVodRemove"
             :before-upload="beforeVodUpload"
             :before-remove="beforeVodRemove"
             :on-exceed="handleUploadExceed"
             :file-list="fileList"
             :limit="1"
             action
             class="upload-demo">
    <el-button size="small"
               type="primary">上传视频</el-button>
    <el-tooltip placement="right-end">
      <div slot="content">
        最大支持1G，
        <br />支持3GP、ASF、AVI、DAT、DV、FLV、F4V、
        <br />GIF、M2T、M4V、MJ2、MJPEG、MKV、MOV、MP4、
        <br />MPE、MPG、MPEG、MTS、OGG、QT、RM、RMVB、
        <br />SWF、TS、VOB、WMV、WEBM 等视频格式上传
      </div>
      <i class="el-icon-question" />
    </el-tooltip>
  </el-upload>
</template>

<script>
import OSS from '@/lib/aliyun-upload-sdk/lib/aliyun-oss-sdk-6.17.1.min'
import '@/lib/aliyun-upload-sdk/aliyun-upload-sdk-1.5.3.min'
import video from "@/api/edu/video";
import data from '@/views/pdf/content';
window.OSS = OSS

export default {
  //写核心代码位置
  // data:{
  // },
  data() {
    //定义变量和初始值
    return {
      fileList: [], //上传文件列表
      uploader:null,
      createUpload:null,
    }
  },
  created() {
    //页面渲染之前执行，一般调用methods定义的方法
    //调用
    
  },
  mounted(){
    this.uploader = new AliyunUpload.Vod({
        //userID，必填，您可以使用阿里云账号访问账号中心（https://account.console.aliyun.com/），即可查看账号ID
      userId:"1261501468546649",
      //上传到视频点播的地域，默认值为'cn-shanghai'，
      //eu-central-1，ap-southeast-1
      region:"",
        //分片大小默认1 MB，不能小于100 KB（100*1024）
      partSize: 1048576,
      //并行上传分片个数，默认5
      parallel: 5,
      //网络原因失败时，重新上传次数，默认为3
      retryCount: 3,
      //网络原因失败时，重新上传间隔时间，默认为2秒
      retryDuration: 2,
        //开始上传
        'onUploadstarted': function (uploadInfo) {
          console.log("uploader:",this.uploader)
          console.log("uploadInfo:",uploadInfo)
          this.uploader.setUploadAuthAndAddress(uploadInfo, createUpload.uploadAuth,  createUpload.uploadAddress, createUpload.videoId) 
        },
        //文件上传成功
        'onUploadSucceed': function (uploadInfo) {
          console.log("onUploadSucceed: " + uploadInfo.file.name + ", endpoint:" + uploadInfo.endpoint + ", bucket:" + uploadInfo.bucket + ", object:" + uploadInfo.object)
        },
        //文件上传失败
        'onUploadFailed': function (uploadInfo, code, message) {
          console.log("onUploadFailed: file:" + uploadInfo.file.name + ",code:" + code + ", message:" + message)
        },
        //文件上传进度，单位：字节
        'onUploadProgress': function (uploadInfo, totalSize, loadedPercent) {
          console.log("Canceled file: " + uploadInfo.file.name + ", code: " + code + ", message:" + message)
        },
        //上传凭证或STS token超时
        'onUploadTokenExpired': function (uploadInfo) {
          console.log("onUploadProgress:file:" + uploadInfo.file.name + ", fileSize:" + totalSize + ", percent:" + Math.ceil(progress * 100) + "%")
        },
        //全部文件上传结束
        'onUploadEnd':function(uploadInfo){
            console.log("onUploadEnd: uploaded all the files")
        }
    });
    // console.log("uploader:",uploader)
    console.log("this:",this)

  },
  methods: {
    uploadAlyiVideo(context){
      console.log("createUpload:",this.createUpload)
      console.log("uploader:",this.uploader)
      if (this.createUpload !== null) {
        this.uploader.startUpload()
      }
    },
    //上传视频成功调用的方法
    handleVodUploadSuccess(response, file, fileList) {

    },

    //移除视频
    handleVodRemove() {
      //调用接口的删除视频的方法
      video.deleteAliyunvod(this.video.videoSourceId).then((response) => {
        //提示信息
        this.$message({
          type: 'success',
          message: '删除视频成功!',
        })
        //把文件列表清空
        this.fileList = []
      })
    },

    //视频上传之前
    async beforeVodUpload(file) {
      var userData = '{"Vod":{}}'
      this.uploader.addFile(file, null, null, null, userData)
      await video.createUploadVideo(file.uid,file.name).then(({data}) => {
        this.createUpload = data.acsResponse
        // console.log("createUpload:",this.createUpload)
      })
    },
    
    //视频移除之前
    beforeVodRemove(file, fileList) {
      return this.$confirm(`确定移除 ${file.name}?`)
    },

    //上传视频成功调用的方法
    handleVodUploadSuccess(response, file, fileList) {

    },

    handleUploadExceed() {
      this.$message.warning('想要重新上传视频，请先删除已上传的视频')
    },
  },
}
</script>